﻿<!DOCTYPE html>
<html>
<head>
	<title>容器装载记录</title>

	<meta name="keywords" content="keyword1,keyword2,keyword3">
	<meta name="description" content="this is my page">
	<meta name="content-type" content="text/html; charset=UTF-8">
	<link rel="stylesheet" href="/static/plugin/layui/css/layui.css" media="all" />
	<link rel="stylesheet" href="/static/css/public.css" media="all" />
	<script type="text/javascript" src="/static/plugin/jquery/jquery-3.3.1.js"></script>
	<script type="text/javascript" src="/static/plugin/layui/layui.js"></script>
	<script type="text/javascript" src="/static/js/public.js"></script>
	<script type="text/javascript" src="/static/js/base.js"></script>
	<style type="text/css">
		.xing
		{
			color: red;
			float: left;
			display: block;
			width: 0.1%;
			margin-top:-25px;
			margin-left: 83%;
			font-size: 24px;
		}
	</style>
</head>
<script type="text/javascript"></script>
<body  class="layui-anim">
<div class="x-nav">
	    <span class="layui-breadcrumb">
	        <a href="">首页</a>
	        <a>
	            <cite>容器装载记录</cite>
	        </a>
	    </span>
</div>
<div class="x-body">
	<div class="layui-row" style="margin-bottom: 18px">
		<form class="layui-form">
			<div class="layui-inline">
				<div class="layui-input-inline">
					<input type="text" id="keyword01" class="layui-input searchVal" placeholder="请输入容器编号" />
				</div>
				<div class="layui-input-inline">
					<input class="layui-input" id="startTime" placeholder="请输入开始日期" autocomplete="off" style="display: inline; width: 180px; margin-left: 10px">
					-<input class="layui-input" id="endTime" placeholder="请输入结束日期" autocomplete="off" style="display: inline; width: 180px; margin-left: 10px">
				</div>
				<button type="button" class="layui-btn layui-btn-normal" data-type="reload"><i class="layui-icon layui-icon-search"></i>检索</button>
			</div>
		</form>
	</div>
	<table class="layui-hide" id="tableList" lay-filter="tableList"></table>
</div>


<script type="text/javascript">
	layui.use(['table','layer','upload','form','laydate'], function(){
		var table = layui.table;
		var layer = layui.layer;
		var form = layui.form;
		var laydate = layui.laydate;

        /********************************* 开始时间结束时间设置 star *********************************/
            //日期时间范围
        var minListDate = "1000-01-01 00:00:00";//最小可选时间，例：1990-02-01
        var maxListDate = "3000-12-31 23:59:59";//最大可选时间，例：2200-12-31
        //结束时间
        var enddate = laydate.render({
            elem: "#endTime",
            format: 'yyyy-MM-dd HH:mm:ss',
            type: 'datetime',
            min: minListDate,
            max: maxListDate,
            done: function (val, date) {
                if (date && date.year){
                    //设置结束时间 设置开始时间的最大值为结束时间
                    begindate.config.max = {
                        year: date.year,
                        month: date.month - 1,//必须减1才是正确值
                        date: date.date,
                        hours: date.hours,
                        minutes: date.minutes,
                        seconds: date.seconds
                    };
                }else {
                    //清除结束值    设置开始时间最大值
                    var dateInit = new Date(maxListDate.replace(/-/g, "/"));
                    begindate.config.max = {
                        year: dateInit.getFullYear(),
                        month: dateInit.getMonth(),
                        date: dateInit.getDate(),
                        hours: dateInit.getHours(),
                        minutes: dateInit.getMinutes(),
                        seconds: dateInit.getSeconds()
                    };
                }
            }
        });
        //开始时间
        var begindate = laydate.render({
            elem: "#startTime",
            format: 'yyyy-MM-dd HH:mm:ss',
            type: 'datetime',
            min: minListDate,
            max: maxListDate,
            done: function (val, date) {
                if (date && date.year){
                    //设置开始时间 设置结束时间的最小值为开始时间
                    enddate.config.min = {
                        year: date.year,
                        month: date.month - 1,
                        date: date.date,
                        hours: date.hours,
                        minutes: date.minutes,
                        seconds: date.seconds
                    };
                }else {
                    //清除开始值 ，设置结束值最小值
                    var dateInit = new Date(minListDate.replace(/-/g, "/"));
                    enddate.config.min = {
                        year: dateInit.getFullYear(),
                        month: dateInit.getMonth(),
                        date: dateInit.getDate(),
                        hours: dateInit.getHours(),
                        minutes: dateInit.getMinutes(),
                        seconds: dateInit.getSeconds()
                    };
                }
            }
        });
        /********************************* 开始时间结束时间设置  end*********************************/

		var $ = layui.jquery, active = {
			reload:function () {
                var whereStr = ""
                var keyword01 = $("#keyword01").val();
                if(keyword01 != ""){
                    whereStr += " and cnumber like '%" + keyword01+"%'"
                }
                var startTime = $("#startTime").val();
                if(startTime != ""){
                    whereStr += " and csrcreateTime >= '" + startTime+"'"
                }
                var endTime = $("#endTime").val();
                if(endTime != ""){
                    whereStr += " and csrcreateTime <= '" + endTime+"'"
                }
				table.reload('contenttable',{
					method:'get',
					where:{"whereStr":whereStr}
					,page: {
						curr: 1//重新从第 1 页开始
					}
				});
			}
		}

		$('.layui-btn').on('click', function(){
			var type = $(this).data('type');
			active[type] ? active[type].call(this) : '';
		});
		table.render({
			elem: '#tableList'
			,url:'/containerStare/listAllContainerStareRecord'
			,title: '考勤列表'
			,id :'contenttable'
			,limits:[10,20,30]
			,toolbar: '#toolbar'
			,request: {   //如果无需自定义请求参数，可不加该参数
				pageName: 'page' //页码的参数名称，默认：page
				,limitName: 'pageSize' //每页数据量的参数名，默认：limit
			}
			,response: {   //如果无需自定义数据响应名称，可不加该参数
				countName: 'total' //规定数据总数的字段名称，默认：count
				,dataName: 'rows' //规定数据列表的字段名称，默认：data
			}
			,cols: [
				[
					{field:'csrid', title:'序号', sort: true, type:'numbers', width: 60}
					,{field:'container.cnumber', title:'容器编号'
						,templet: function(d){
							var value = "";
							if(d.container != null){
								value = d.container.cnumber
							}
							return value;
						},
					}
					,{field:'material.maNumber', title:'图号'
						,templet: function(d){
							var value = "";
							if(d.material != null){
								value = d.material.maNumber
							}
							return value;
						},
					}
					,{field:'csrnum', title:'产品数量'}
					,{field:'material.remark01', title:'备注1'
						,templet: function(d){
							var value = "";
							if(d.material != null){
								value = d.material.remark01
							}
							return value;
						},
					}
					,{field:'material.remark02', title:'备注2'
						,templet: function(d){
							var value = "";
							if(d.material != null){
								value = d.material.remark02
							}
							return value;
						},
					},{field:'csrremark1', title:'状态'
						,templet: function(d){
							var value = "解绑";
							if(d.csrremark1 == 0 || d.csrremark1 == "0"){
								value = "绑定"
							}
							return value;
						},
					}
					,{field:'csrcreateTime', title:'时间'
						,templet: function(d){
							var value = d.csrcreateTime;
							return formatTime(value,"yyyy-MM-dd HH:mm");
						},
					}
				]
			]
			,page: true
			,done : function(){
				$('th').css({
					'background-color': '#009688', 'color': '#fff','font-weight':'bold',
				})
			}
		});
	});
</script>
</body>
</html>
